<template>
  <div id="Bankdocfile">
    <Filters
      block
      :form="searchForm"
      :filterData="filterData"
      @confirm="changePage(1)"
    />
    <div class="container">
      <DataTable
        rowKey="pkBankdoc"
        :btns="btns"
        :tableData="Data"
        :tableColumn="tableColumn"
        :pageConfig="pageConfig"
        @refresh="getList"
      />
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue, Watch } from 'vue-property-decorator';

@Component
export default class Bankdocfile extends Vue {
  searchForm: any = {
    name: '',
    enablestate: ''
  }
  btns: any[] = [
    {
      label: '新增银行',
      icon: 'add',
      callback: () => this.$router.push('/files/bankdocfile/edit')
    }
  ];
  get filterData () {
    return {
       name: {
        label: '银行名称',
        type: 'input',
        template: {
          placeholder: '银行名称',
          clearable: true
        }
      },
      enablestate: {
        label: '启用状态',
        type: 'select',
        template: {
          placeholder: '全部',
          options: [{label: '全部', value: ''}, {label: '启用', value: '2'}, {label: '禁用', value: '3'}],
          clearable: true
        }
      }
    };
  }
  Data: any[] = [];
  tableColumn: any = {
    code: {
      label: '银行编码',
      minWidth: 120
    },
    name: {
      label: '银行名称',
      minWidth: 120
    },
    province: {
      label: '省',
      minWidth: 100
    },
    city: {
      label: '市',
      minWidth: 120
    },
    bankarea: {
      label: '开户地区',
      minWidth: 120
    },
    enablestate: {
      label: '是否启用',
      minWidth: 170,
      type: 'select',
      disabled: true,
      options: [
        {
          label: '启用',
          value: 2
        },
        {
          label: '禁用',
          value: 3
        }
      ]
    },
    action: {
      label: '操作',
      width: 230,
      template: [
        {
          tag: 'router-link',
          text: '编辑',
          path: '/files/bankdocfile/edit',
          query: {
            pkBankdoc: ''
          }
        },
        {
            tag: 'router-link',
            text: '详情',
            path: '/files/bankdocfile/detail',
            query: {
              pkBankdoc: ''
            }
        },
        {
            tag: 'a',
            text: '删除',
            callback: this.deleteCheck
          }
      ]
    }
  };

  pageConfig: any = {
    current: 1,
    total: 10,
    pageSize: 10,
    onChange: this.changePage
  };

  init () {
    this.getList()
  }
  getSearchForm () {
    let { searchForm } = this
    let { current, pageSize } = this.pageConfig
    let form = Object.assign({ page: current, size: pageSize }, searchForm);
    return form;
  }


  // 任务列表
  getList () {
    let data = this.getSearchForm()
    // console.log("测试"+data)
    this.$api.bankdocListFetch(data).then((res: any) => {
      this.Data = res.data.records;
      // console.log(this.Data)
      this.pageConfig.total = res.data.total
      if (!this.Data.length && this.pageConfig.current > 1) {
        --this.pageConfig.current;
        this.getList();
      }
    });
  }


   // 删除
  deleteCheck (val: any) {
    let params = {
        phid: val.pkBankdoc
    }
    this.$confirm({
      title: '提示',
      content: '是否确定删除？',
      onOk: () => {
         this.$api.bankdocDeleteFetch(params).then((res) => {
          this.$message.success('删除成功')
           this.getList()
         }).catch()
      },
      onCancel: () => {}
    })
  }

  changePage (val: number) {
    this.pageConfig.current = val;
    this.getList();
  }
}
</script>

<style lang="scss">
</style>
